import React, { Component } from 'react'

export default class Tabs extends Component {
  render() {
    const { tabs, active, handleActive } = this.props
    return (
      <div className='tabs-order'>
        <ul className='sort-container'>
          {/* // #2. 子组件调用这个方法 */}
          {tabs.map((item) => (
            <li
              className={item.type === active ? 'on' : ''}
              key={item.id}
              onClick={() => handleActive(item.type)}
            >
              按{item.name}排序
            </li>
          ))}
        </ul>
      </div>
    )
  }
}
